@import "compass/css3";
.dialog-login-modal{
	.login-form-item{
		@include display-flex;
		@include align-items(center);
		@include justify-content(space-between);
		margin-bottom: rem(8);
		.input-wrap{
			@include flex(1);
			@include display-flex;
			@include align-items(center);
			padding:rem(10);
			height: rem(45);
			background-color: #F2F7FA;
			box-sizing:border-box;
			width: 100%;
			border-radius: 2px;
			.input{
				font-size: rem(15);
				background-color: transparent;
			}
		}

		.code-image{
			margin-left: rem(6);
			@include flex-shrink(0);
			width: rem(95);
			height: rem(45);
			background-color: #e9e9e9;
			border-radius: 2px;
			img{
				width: 100%;
				height: 100%;
			}
		}
		.login-send-sms-btn{
			position: relative;
			margin-left: rem(6);
			@include flex-shrink(0);
			width: rem(95);
			height: rem(44);
			font-size: rem(15);
			line-height: rem(44);
			color: #641A83;
			text-align: center;
			box-sizing:border-box;
			&.disabled{
				color: #ddd;
				&:before{
					border-color: #ddd;
				}
			}
			&:before{
				content: " ";
				position: absolute;
				left: 0;
				top: 0;
				width: 200%;
				height: 200%;
				border:1px solid #641A83;
				border-radius: 4px;
				@include transform-origin(0,0);
				@include transform(scale(0.5));
			}
		}
		
	}
	.captcha-from-item{
		display: none;
		&.show{
			@include display-flex;
		}
	}
}
.dialog-captcha-modal{
	font-size:rem(16);
	line-height: rem(22);
	color: #666;
	text-align: left;
	.captcha-code{
		margin-top: rem(10);
		position: relative;
		width: 100%;
		min-height: rem(120);
		background-color: #F2F7FA;
		// border:1px solid red;
		.code-image{
			width: 100%;
		}
		.captcha-change-btn{
			position: absolute;
			right: rem(5);
			bottom: rem(5);
			line-height: rem(17);
			.text{
				font-size: rem(12);
				color: #999999;
			}
		}
	}
	.captcha-input,.error-tips{
		margin-top: rem(10);
		@include display-flex;
		@include align-items(center);
		@include justify-content(space-between);
		.label{
			@include flex-shrink(0);
			font-size: rem(14);
			line-height: rem(20);
			color: #666;
		}
		.input-box{
			@include display-flex;
			@include align-items(center);
			position: relative;
			padding: rem(2) 0;
			@include flex(1);
			height: rem(38);			
			&:before{
				content: " ";
				position: absolute;
				left: 0;
				top: 0;
				width: 200%;
				height: 200%;
				border:1px solid #E9E9E9;
				@include transform-origin(0,0);
				@include transform(scale(0.5));
			}
			.input{
				margin-left: rem(10);
				position: relative;
				height: 100%;
				z-index: 2;
			}
			.input-clear-icon{
				position: relative;
				@include flex-shrink(0);
				margin-left: rem(5);
				display: none;
				margin-right: rem(5);
				z-index: 2;
				&.show{
					display: inherit;
				}
			}
			
		}

	}
	.error-tips{
		margin-top: rem(8);
		height: 0;
		@include transform-origin(0,0);
		@include transition(all linear 0.1s);
		&.show{
			height: rem(24);
		}
		.label{
			width: rem(140);
		}
		.error-text{
			@include flex(1);
			font-size: rem(13);
			color: #641A83;
		}
	}
	
}















